@import "../../../styles/bootstrap-variables";
@import "bootstrap/scss/popover";
.bs-popover{
  padding: 0;
  max-width: 276px;
  .popover-header{
    position: relative;
    z-index: 2;
  }
  .bs-popper-arrow{
    width: 0.75rem;
    height: 0.75rem;
    &::before{
      width: 0.75rem;
      height: 0.75rem;
      border: 1px solid transparent;
      //background-color: #F7F7F7;
    }
  }
  &[data-popper-placement^='top']{
    .bs-popper-arrow{
      bottom: -0.375rem;
      &::before{
        border-bottom-color: rgba(0,0,0,0.2);
        border-right-color: rgba(0,0,0,0.2);
      }
    }
  }
  &[data-popper-placement^='bottom']{
    .bs-popper-arrow{
      top: -0.375rem;
      &::before{
        border-top-color: rgba(0,0,0,0.2);
        border-left-color: rgba(0,0,0,0.2);
      }
    }
  }
  &[data-popper-placement^='left']{
    .bs-popper-arrow{
      right: -0.375rem;
      &::before{
        border-top-color: rgba(0,0,0,0.2);
        border-right-color: rgba(0,0,0,0.2);
      }
    }
  }
  &[data-popper-placement^='right']{
    .bs-popper-arrow{
      left: -0.375rem;
      &::before{
        border-bottom-color: rgba(0,0,0,0.2);
        border-left-color: rgba(0,0,0,0.2);
      }
    }
  }
}
